<template>
  <el-card>
    <PageTools :total="100" />
    <el-table :data="list" style="width: 100%">
      <el-table-column prop="type" label="操作类型" width="width" />
      <el-table-column prop="name" label="操作人" width="width" />
      <el-table-column prop="content" label="执行结果" width="width" />
      <el-table-column prop="time" label="操作时间" width="width" />
      <el-table-column prop="describe" label="描述" width="width" />
    </el-table>
    <!-- 分页 -->
    <el-row type="flex" justify="end">
      <el-pagination
        background
        :current-page="queryData.page"
        :page-sizes="[10, 12, 15, 20]"
        :page-size="queryData.size"
        :total="total"
        layout="total, prev, pager, next, jumper"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </el-row>
  </el-card>
</template>

<script>
import { getList } from '@/api/logs'
import PageTools from '@/components/PageTools'
export default {
  components: {
    PageTools
  },
  data() {
    return {
      list: [],
      total: null,
      queryData: {
        page: 1,
        size: 10
      }
    }
  },
  created() {
    this.initData()
  },
  methods: {
    handleSizeChange(val) {
      this.queryData.size = val
      this.initData()
    },
    handleCurrentChange(val) {
      this.queryData.page = val
      this.initData()
    },
    async initData() {
      const { list, total } = await getList(this.queryData)
      this.list = list
      this.total = total
    }
  }
}
</script>

<style>
</style>
